<template>
  <view class="container screen-width">
    <view class="summary">
      全部认领企业
      <text class="summary-hint">（{{ total }}）</text>
    </view>
    <scroll-view class="list" :scroll-y="true" @scrolltolower="fetchData()">
      <!-- <view class="item u-flex" v-for="(item, index) in list" :key="index">
        <u-image
          class="logo"
          :src="$imgUrl + item.logo"
          width="160"
          height="100"
        ></u-image>
        <view>
          <view class="title">{{ item.companyName }}</view>
          <view class="date">{{ item.createTime }}</view>
        </view>
      </view>-->
      <radio-group @change="radioChange">
        <label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in list" :key="item.id">
          <view class="company-content flex items-middle space-between">
            <view class="item u-flex">
              <u-image class="logo" :src="$imgUrl + item.logo" width="160" height="100"></u-image>
              <view>
                <view class="title">{{ item.companyName }}</view>
                <view class="date">{{ item.createTime }}</view>
              </view>
            </view>
            <view v-if="item.claimStatus===2">
              <radio :value="item.companyId" :checked="index === current" />
            </view>
            <view class="no-pass" v-else>未通过认证</view>
          </view>
        </label>
      </radio-group>

      <u-loadmore
        bg-color="#ffffff"
        style="width: 100%;  margin-top: 15rpx;  padding-right: 30rpx"
        :status="status"
      />
    </scroll-view>

    <view
      v-if="list.length && list.length>0"
      class="bottom-btn screen-width"
      @click="toWebsite"
    >进入企业微官网</view>
    <Festival></Festival>
  </view>
</template>

<script>
import { deptFollowList, comFollowList, comList } from "../../util/api/user";
export default {
  data() {
    return {
      current: -1,
      list: [],
      total: 0,
      params: {
        pageNo: 1,
        pageSize: 15
      },
      status: "loadmore",
      companyId: ""
    };
  },
  onLoad() {
    this.fetchData();
  },
  methods: {
    radioChange: function(evt) {
      for (let i = 0; i < this.list.length; i++) {
        if (this.list[i].companyId === evt.target.value) {
          this.companyId = evt.target.value;
          this.current = i;
          break;
        }
      }
    },
    // 去企业微官网
    toWebsite() {
      if (this.companyId) {
        uni.navigateTo({
          url: `/pages/companyWeb/Index?companyId=${this.companyId}`
        });
      } else {
        uni.showToast({
          title: "请先选择您想查看的公司",
          duration: 2000,
          icon: "none"
        });
      }
    },
    fetchData(reset = false) {
      if (reset) {
        this.resetPagination();
      }
      uni.showLoading();
      this.status = "loading";
      comList(this.params).then(res => {
        uni.hideLoading();
        this.$nextTick(() => {
          let { records } = res.result;
          this.total = res.result.total;
          if (!records.length) {
            this.status = "nomore";
            return;
          }
          this.list = reset ? records : this.list.concat(records);
          this.params.pageNo += 1;
          this.status = "loadmore";
        });
      });
    },
    resetPagination() {
      this.params.pageNo = 1;
      this.list = [];
      this.status = "loadmore";
    }
  }
};
</script>

<style lang="scss" scoped>
.container {
  height: 100%;
  max-height: 100%;

  .summary {
    height: 120rpx;
    padding: 0 30rpx;
    line-height: 120rpx;
    font-size: 32rpx;
    font-family: PingFang SC, PingFang SC-Bold;
    font-weight: 700;
    text-align: left;
    color: #333333;

    &-hint {
      color: #1678ff;
    }
  }

  .list {
    height: calc(100% - 100rpx);
    width: 100%;
    background: #fff;
    padding: 0 30rpx;
    padding-bottom: 120rpx;
    .company-content {
      border-bottom: 1rpx solid #ebebeb;
    }
    .item {
      height: 200rpx;
      .title {
        font-size: 28rpx;
        font-family: PingFang SC, PingFang SC-Regular;
        font-weight: 400;
        text-align: left;
        color: #333333;
      }

      .logo {
        margin-right: 70rpx;
      }
      .date {
        font-size: 22rpx;
        font-family: PingFang SC, PingFang SC-Regular;
        font-weight: 400;
        text-align: left;
        color: #aaaaaa;
      }
      .sub-cancel {
        width: 120rpx;
        height: 48rpx;
        opacity: 1;
        background: #e8f3ff;
        border-radius: 8rpx;
        color: #1678ff;
        line-height: 48rpx;
        text-align: center;
      }
    }
    .no-pass {
      font-size: 12px;
      color: #aaaaaa;
    }
  }
  .bottom-btn {
    position: fixed;
    bottom: 0;
    width: 100%;
    padding: 25upx 0;
    text-align: center;
    background: #1678ff;
    color: white;
    font-size: 16px;
  }
}
</style>
